calendar: Improve the accessibility of the "Do Not Disturb" switch

Set the do not disturb label as the label actor for the do not disturb switch,
so that Orca speaks the do not disturb label when the user moves
keyboard focus to the do not disturb switch.

Also enable toggle mode for the "Do Not Disturb" button and bind it's checked
state to the state property of the switch. This makes sure that Orca presents
thecorrect state of the do not disturb switch to the user.

Fixes https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/2508

diff --git a/js/ui/calendar.js b/js/ui/calendar.js
index 5b2e9477322fab36eaf66e26b549b73384ab3f52..99641841768fca6ef96bb41197fce1c75040fbc2 100644 (file)
--- a/js/ui/calendar.js
+++ b/js/ui/calendar.js
@@ -1153,17 +1153,22 @@ class CalendarMessageList extends St.Widget {
         let hbox = new St.BoxLayout({ style_class: 'message-list-controls' });
         box.add_child(hbox);
 
-        hbox.add_child(new St.Label({
+        const dndLabel = new St.Label({
             text: _('Do Not Disturb'),
             y_align: Clutter.ActorAlign.CENTER,
-        }));
+        });
+        hbox.add_child(dndLabel);
 
         this._dndSwitch = new DoNotDisturbSwitch();
         this._dndButton = new St.Button({
             can_focus: true,
+            toggle_mode: true,
             child: this._dndSwitch,
+            label_actor: dndLabel,
         });
-        this._dndButton.connect('clicked', () => this._dndSwitch.toggle());
+        this._dndButton.bind_property('checked',
+            this._dndSwitch, 'state',
+            GObject.BindingFlags.BIDIRECTIONAL | GObject.BindingFlags.SYNC_CREATE);
         hbox.add_child(this._dndButton);
 
         this._clearButton = new St.Button({